<%--
  Created by IntelliJ IDEA.
  User: 张帆
  Date: 2022/6/28
  Time: 14:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>列表页面</title>
    <style>
        div {
            margin-top: 50px;
            background-color: #E7DED9;
            text-align: center;
            width: 100%;
        }
    </style>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/bootstrap.js" type="text/javascript"></script>
</head>
<body>
    <h1>欢迎${user.username}  &nbsp;&nbsp;<a href="userservlet?method=loginOut">退出</a></h1><br>
    <table align="center" width="90%" border="1" style="text-align: center;font-size: 20px;">
        <tr style="color: yellow">
            <th>编号</th>
            <th>姓名</th>
            <th>生日</th>
            <th>性别</th>
            <th>职业</th>
            <th>住所</th>
            <th>电话</th>
            <th>操作</th>
        </tr>
        ${msg}
        <c:forEach items="${pageBean.data}" var="profile">
            <tr>
                <th>${profile.id}</th>
                <th>${profile.name}</th>
                <th>${profile.birthday}</th>
                <th>${profile.gender}</th>
                <th>${profile.career}</th>
                <th>${profile.address}</th>
                <th>${profile.mobile}</th>
                <th>
                    &nbsp;<button type="button" id="btn1"><a href="profileservlet?method=detailProfile&id=${profile.id}">明细</a></button>&nbsp;&nbsp;
                    <button type="button" id="btn2"><a href="profileservlet?method=loadUpdateInfoProfile&id=${profile.id}">修改</a></button>&nbsp;
                </th>
            </tr>
        </c:forEach>
    </table>
    <div>
        共${pageBean.pageCount}页&nbsp;&nbsp;
        <a href="profileservlet?method=listProfile&pageNum=1">首页</a>&nbsp;&nbsp;
        <a href="profileservlet?method=listProfile&pageNum=${pageBean.pageNum-1}">上一页</a>&nbsp;&nbsp;
        <a href="profileservlet?method=listProfile&pageNum=${pageBean.pageNum+1}">下一页</a>&nbsp;&nbsp;
        <a href="profileservlet?method=listProfile&pageNum=${pageBean.pageCount}">尾页</a>&nbsp;&nbsp;
        跳转到
        <select name="page" id="page" onchange="change();">
            <option value="#">请选择</option>
        </select>
    </div>
    <script type="text/javascript">
        $(function () {
            for (let i = 1;i <= ${pageBean.pageCount};i++){
                $("#page").append("<option value='"+i+"'>"+i+"</option>");
            }
        })();

        function change() {
            let page = document.getElementById("page");
            $(location).attr("href","profileservlet?method=listProfile&pageNum="+page.value);
        }
    </script>
</body>
</html>
